<template>
  <div>
    <ul class="d-flex flex-wrap space-between" >
      <li v-for="(item, index) in lists" :key="index + ''" class="w-49" @click="btn(item.id)">
        <img :src="item.cover" class="w-100" />
        <div>
          <span class="listTitle d-block">{{ item.title }}</span>
          <span class="listDesc d-block mt-05">{{ item.desc }}</span>
          <div class="d-flex">
            <price>{{ item.pprice }} {{item.min_price}}</price>
            <div class="vb-0 gray ml-03">￥{{ item.oprice }} {{item.min_oprice}}</div>
          </div>
        </div>
      </li>
    </ul>
    <div style="height:50px"></div>
  </div>
</template>
<script>
import price from '../price/index'
export default {
  props: ['lists'],
  // props: {
  //   lists: {
  //     type: Object,
  //     default: {}
  //   }
  // },
  components: {
    price
  },
  methods: {
    btn(_id){
      this.$router.push({
        name:"Details",
        query:{
          id:_id
        }
      })
    }
  }
};
</script>